<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"  import="java.util.*"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var url = "";
function newObject(){
	$("#dlgAdd").dialog("open").dialog("setTitle","Open dialog add new");
	$("#fmAdd").form("clear");
	url = "DON_VI_TCServlet?flag=add";
}
	
function editObject(){
	var row = $("#tt").datagrid("getSelected");
	if (row){
		$("#dlg").dialog("open").dialog("setTitle","Open dialog edit");
		$("#fm").form("load",row);
		url = "DON_VI_TCServlet?flag=edit";
	} else {
		alert("Bạn chưa chọn dữ liệu cần cập nhật！");
	}
}
	
function searchObject(){
	$('#tt').datagrid('load',{
		searchTen: $('#searchTen').val(),
	});
}
	
function removeObject(){
	//var row = $("#tt").datagrid("getSelected");
	var ids = [];
	var rows = $('#tt').datagrid('getSelections');
	for(var i=0; i<rows.length; i++){
		ids.push(rows[i].id_don_vi_tc);
	}
	if (rows!=""){
		$.messager.confirm("Confirm","Bạn muốn xóa mẩu tin này?",function(r){
		if (r){
			$.post("DON_VI_TCServlet?flag=remove", {
					//id : row.id_don_vi_tc
					id : ids.join(',')
				}, function(result) {
					if (result.success) {
							$("#tt").datagrid("reload"); // reload the user data
							$.messager.show({
								title: "Delete",
								msg: result.msg
							});
					} else {
						$.messager.show({
							title: "Error !",
							msg: result.msg
						});
					}
				}, "json");
			}
		});
	}else {
		alert("Bạn chưa chọn dữ liệu cần xóa！");
	}
}
	
function saveObject(){
	$("#fm").form("submit",{
		url: url,
		onSubmit: function(){
			return $(this).form("validate");
		},
		success: function(result){
			var r = eval("("+result+")");
			if (r.success){
				$("#dlg").dialog("close"); // close the dialog
				$("#tt").datagrid("reload"); // reload the user data
				$.messager.show({
					title: "Update",
					msg: r.msg
				});
			} else {
				$.messager.show({
					title: "Error !",
					msg: r.msg
				});
			}
		}
	});
}

function saveObjectAdd(){
	$("#fmAdd").form("submit",{
		url: url,
		onSubmit: function(){
			return $(this).form("validate");
		},
		success: function(result){
			var r = eval("("+result+")");
			if (r.success){
				$("#dlgAdd").dialog("close"); // close the dialog
				$("#tt").datagrid("reload"); // reload the user data
				$.messager.show({
					title: "Update",
					msg: r.msg
				});
			} else {
				$.messager.show({
					title: "Error !",
					msg: r.msg
				});
			}
		}
	});
}

jQuery(function() {
	$("#searchTen").autocomplete("search/searchDonViTC.jsp");
});
</script>

<script type="text/javascript">
    var xmlHttp=null;
    function getXMLHttpRequest()
    {
    	try
    	{
    		xmlHttp=new XMLHttpRequest();// Firefox, Opera 8.0+, Safari
    	}
    	catch (ex)
    	{
    		try
    		{
    			xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");//Explorer 6.0+
    		}
    		catch (ex)
    		{
    			try
    			{
    				xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");//Explorer 5.5+
				} catch (ex) {
					return false;
				}
			}
		}
		return xmlHttp;
	}
	function checkMa(ma_don_vi) {
		xmlHttp = getXMLHttpRequest();
		var msg = document.getElementById("maMessage");
		if (xmlHttp != null) {
			xmlHttp.onreadystatechange = function() {
				if (xmlHttp.readyState == 4) {
					if (xmlHttp.status == 200) {
						var check = xmlHttp.responseText;
						if (check == 0) {
							msg.innerHTML = "";
							document.getElementById("dlg-buttons-add").style.visibility = "visible";
						} else if (check == 1) {
							msg.innerHTML = "Mã Đơn vị đã tồn tại";
							document.getElementById("dlg-buttons-add").style.visibility = "hidden";
						};
					} else {
						msg.innerHTML = "Server đang bận ...";
					}
				} else {
					msg.innerHTML = "Đang kiểm tra ...";
				};
			};
			var url = "view/checkMaDonViTC.jsp?ma_don_vi=" + ma_don_vi + "&id=" + Math.random();
			xmlHttp.open("GET", url, true);
			xmlHttp.send(null);
		} else {
			alert("Trình duyệt không hỗ trợ Ajax");
			return false;
		}
	}
</script>
<style type="text/css">
#fm {
	margin: 0;
	padding: 5 0px;
}

.ftitle {
	font-size: 14px;
	font-weight: bold;
	color: #000000;
	padding: 5px 0;
	margin-bottom: 10px;
	border-bottom: 1px solid #ccc;
}

.fitem {
	margin-bottom: 7px;
}

.fitem label {
	display: inline-block;
	width: 140px;
}

.fitem input {
	display: inline-block;
	width: 290px;
	background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #888888;
    border-radius: 5px 5px 5px 5px;
    color: #222222;
    margin: 0 5px 0 0;
    padding: 3px 4px;
}
</style>
</head>
<body>
	<table id="tt" class="easyui-datagrid" 
			style="width:795px;height:574px"
			url="DON_VI_TCServlet"
			title=":: ĐƠN VỊ TỔ CHỨC" toolbar="#tb"
			rownumbers="true" pagination="true" singleSelect="false" fitColumns="true">
		<thead>
			<tr>
				<th field="ck" checkbox="true"></th>
				<th field="ma_don_vi">Mã Đơn Vị</th>
				<th field="ten">Tên Đơn Vị</th>
				<th field="cap">Cấp</th>
				<th field="ten_don_vi_cha">Đơn Vị TC Cha</th>
				<th field="ten_loai_don_vi">Loại Đơn Vị</th>
			</tr>
		</thead>
	</table>
	
	<div id="tb" style="padding:5px">
		<div>
			<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newObject()">Thêm</a> 
			<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editObject()">Sửa</a> 
			<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="removeObject()">Xóa</a>
		</div>
		<div style="padding:5px">
			<input class="search" id="searchTen" name="searchTen" type="text" placeholder="nhập tên đơn vị cần tìm">
			<a href="#" class="easyui-linkbutton" iconCls="icon-searchs" plain="true" onclick="searchObject()">Tìm Kiếm</a>
		</div>
	</div>
	
	<!--------------------------------- Edit Don vi ------------------------------>
	<div id="dlg" class="easyui-dialog"
		style="width: 520px; height: 280px; padding: 10px 20px" closed="true"
		buttons="#dlg-buttons">
		<div class="ftitle">ĐƠN VỊ TỔ CHỨC</div>
		<form id="fm" method="post">
			<div class="fitem" >
				<input type="hidden" name="id_don_vi_tc" class="easyui-validatebox">
			</div>

			<div class="fitem">
				<label>Mã Đơn Vị:</label> 
				<input type="text" name="ma_don_vi" class="easyui-validatebox" required="true">
			</div>
			
			<div class="fitem">
				<label>Tên Đơn Vị:</label> 
				<input type="text" name="ten" class="easyui-validatebox" required="true">
			</div>
			
			<div class="fitem">
				<label>Cấp:</label> 
				<select id="cap" class="easyui-combobox" name="cap" required="true" style="width:300px; height: 25px">  
				    <option value="1">Cấp 1</option>  
				    <option value="2">Cấp 2</option>  
				    <option value="3">Cấp 3</option>
				    <option value="4">Cấp 4</option>
				    <option value="5">Cấp 5</option>
				</select>
			</div>
						
			<div class="fitem">
				<label>Đơn Vị TC Cha:</label> 
				<input name="id_don_vi_tc_cha" class="easyui-combobox" required="true" style="width:300px; height: 25px"
				url="view/loadDonViTC.jsp"
            	valueField="id"
            	textField="ten"
            	value="ten">
			</div>
			
			<div class="fitem">
				<label>Loại Đơn Vị:</label> 
				<input name="id_loai_don_vi_tc" class="easyui-combobox" required="true" style="width:300px; height: 25px"
				url="view/loadLoaiDonViTC.jsp"
            	valueField="id"
            	textField="ten"
            	value="ten"
            	>
			</div>
			
		</form>
	</div>
	
	<div id="dlg-buttons">
		<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveObject()">Lưu</a> 
		<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">Hủy Bỏ</a>
	</div>
	
	<!--------------------------------- Add Don vi ------------------------------>
	<div id="dlgAdd" class="easyui-dialog"
		style="width: 520px; height: 290px; padding: 10px 20px" closed="true"
		buttons="#dlg-buttons-add">
		<div class="ftitle">ĐƠN VỊ TỔ CHỨC</div>
		<form id="fmAdd" method="post">

			<div class="fitem">
				<label>Mã Đơn Vị:</label> 
				<input type="text" id="ma_don_vi" name="ma_don_vi" onblur="checkMa(this.value)" class="easyui-validatebox" required="true">
			</div>
			<div class="fitem" style="margin-left: 145px;">
				<span id="maMessage" style="color: red;"></span>
			</div>
			
			<div class="fitem">
				<label>Tên Đơn Vị:</label> 
				<input type="text" name="ten" class="easyui-validatebox" required="true">
			</div>
			
			<div class="fitem">
				<label>Cấp:</label> 
				<select id="cap" class="easyui-combobox" name="cap" required="true" style="width:300px; height: 25px">  
				    <option value="1">Cấp 1</option>  
				    <option value="2">Cấp 2</option>  
				    <option value="3">Cấp 3</option>
				    <option value="4">Cấp 4</option>
				    <option value="5">Cấp 5</option>
				</select>
			</div>
						
			<div class="fitem">
				<label>Đơn Vị TC Cha:</label> 
				<input name="id_don_vi_tc_cha" class="easyui-combobox" required="true" style="width:300px; height: 25px"
				url="view/loadDonViTC.jsp"
            	valueField="id"
            	textField="ten"
            	value="ten">
			</div>
			
			<div class="fitem">
				<label>Loại Đơn Vị:</label> 
				<input name="id_loai_don_vi_tc" class="easyui-combobox" required="true" style="width:300px; height: 25px"
				url="view/loadLoaiDonViTC.jsp"
            	valueField="id"
            	textField="ten"
            	value="ten"
            	>
			</div>
			
		</form>
	</div>
	
	<div id="dlg-buttons-add">
		<a href="#" class="easyui-linkbutton" iconCls="icon-ok" onclick="saveObjectAdd()">Lưu</a> 
		<a href="#" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlgAdd').dialog('close')">Hủy Bỏ</a>
	</div>
</body>
</html>